<template>
    <div style="height: 100%;">

        <div class="title" style="margin-bottom: 10px;display: flex;justify-content: center;">
            <div>销货单查询</div>
            <div style="margin-left: 20px;">（销售总金额：{{totalAmount}}）</div>
        </div>
        <avue-crud ref="crud" :data="tableData" :table-loading="dataListLoading" :option="{
            searchMenuSpan: 4,
            columnBtn: false,
            border: true,
            index: true,
            indexLabel: '序号',
            stripe: true,
            menuAlign: 'center',
            align: 'center',
            addBtn: false,
            addRowBtn: false,
            editBtn: false,
            delBtn: true,
            menu: false,
            highlightCurrentRow: true,
            searchSpan: 5,
            menuWidth: 100,
            showSummary: false,
            selection: false,
            height: 'calc(100vh - 320px)', // 关键：设置表格高度（减去标题和搜索区高度）
            // height: ,
            column: tableColumn
        }" :page="page" @search-change="searchChange" @on-load="getList" @refresh-change="refreshChange">
            <template slot="menuLeft">
               <div style="display: flex">

                   <div style="width: 100%;display: flex;">
                       <el-date-picker type="date" placeholder="起始日期" v-model="beginDate" value-format="yyyy-MM-dd" style="width: 100%;"></el-date-picker>
                       <div style="width: 50px;display: flex;align-items: center;justify-content: center;">-</div>
                       <el-date-picker type="date" placeholder="结束日期" v-model="endDate" value-format="yyyy-MM-dd" style="width: 100%;"></el-date-picker>


                       <el-input placeholder="业务员姓名模糊查询"  v-model="biz3" label="业务员(模糊查询)"></el-input>
                       <el-button icon="el-icon-search"
                                  size="small"
                                  type="primary" @click="getList({currentPage: 1,pageSize: 1000})" style="margin-left: 20px;">查询
                       </el-button>
                       <el-button icon="el-icon-plus"
                                  size="small"
                                  type="primary" @click="getSalesListByErp()">获取ERP销售信息
                       </el-button>
                   </div>
               </div>
            </template>
        </avue-crud>


    </div>
</template>

<script>
import { excelToData } from '@/utils/upload';
import { add } from 'lodash';
export default {
    data() {
        return {
            buttonList: [
                { name: "保存", code: "save", type: "success" },
                { name: "导入", code: "import", type: "primary" },
                { name: "新增", code: "add", type: "primary" },
                { name: "删除", code: "delete", type: "danger" },
            ],
            dataListLoading: false,
            loading: false,
            totalAmount: 0,
            tableData: [

            ],
            tableColumn: [
                { prop: 'custCode', label: '客户代码',sortable: true, cell: true },
                { prop: 'custName', label: '客户名称',sortable: true, cell: true, width: 300 },
               /* { prop: 'prodCode', label: '产品代码', cell: true },
                { prop: 'prodName', label: '产品名称', cell: true },
                { prop: 'prodSpec', label: '产品规格', cell: true },
                { prop: 'prodLength', label: '商品长度', cell: true },
                { prop: 'prodWidth', label: '商品宽度', cell: true },
                { prop: 'salesDate', label: '销售日期', cell: true },
                { prop: 'deliverTime', label: '送达时间', cell: true },
                { prop: 'qty', label: '销售数量', cell: true },
                { prop: 'price', label: '销售单价(元)', cell: true },
                *
                */
                { prop: 'saleamt', label: '销售金额(元)',sortable: true, cell: true },
                { prop: 'deliverTime', label: '交货时间',sortable: true, cell: true },
                { prop: 'biz2', label: '单号',sortable: true, cell: true },
                { prop: 'biz3', label: '业务员',sortable: true, cell: true },
               /* { prop: 'biz3', label: '备注3', cell: true },
                { prop: 'biz4', label: '备注4', cell: true },
                { prop: 'biz5', label: '备注5', cell: true },
                { prop: 'biz6', label: '备注6', cell: true },*/


            ],
            page: {
                total: 0, // 总页数
                currentPage: 1, // 当前页数
                pageSize: 1000, // 每页显示多少条
                pageSizes: [1000]
            },
            beginDate: wfy.format("yyyy-MM" + "-01", new Date()),
            endDate: wfy.format("yyyy-MM-dd", new Date()),
            biz3: ""

        }
    },
    mounted() {

    },
    methods: {
        deleteHandle(type) {
            this.$confirm(`确定进行批量删除操作?`, '友情提醒', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            })
                .then(() => {
                    this.$http({
                        url: this.$http.adornUrl(`/crm/okr/deleteOkrInfo`),
                        method: 'delete',
                        data: this.$http.adornData({
                            type: type,
                            ids: ids
                        }, false)
                    }).then(({ data }) => {
                        this.$message({
                            message: '操作成功',
                            type: 'success',
                            duration: 1500,
                            onClose: () => {
                                this.getSourceDataList(this.page)
                            }
                        })
                    })
                })
                .catch(() => { })
        },
      getSalesListByErp () {
          let addDay = wfy.getAllDay(this.beginDate,this.endDate)
          console.log('🚀 ~ addDay', addDay)
          if(addDay.length > 10){
              return this.$message.warning("日期范围不能10天")
          }
        this.$confirm(`确定要获取ERP信息吗?`, '友情提醒', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
            .then(() => {
              this.$http({
                url: this.$http.adornUrl(`/crm/base/emp/getSalesListByErp`),
                method: 'post',
                data: this.$http.adornData({
                    begDate: this.beginDate,
                    endDate: this.endDate
                }, false)
              }).then(({data}) => {
                this.$message({
                  message: '获取成功，请点击查询重新加载数据！',
                  type: 'success',
                  duration: 1500,
                  onClose: () => {
                    // this.getDataList(this.page)
                  }
                })
              })
            })
            .catch(() => {
            })
      },
        searchChange(params, done) {
            this.getList(this.page, params, done)
        },
        refreshChange() {
            this.getList(this.page)
        },

        getList(page, params, done) {
            console.log('page,params,done:', page, params, done);
            this.page.currentPage = page.currentPage;
            let addDay = wfy.getAllDay(this.beginDate,this.endDate)
            console.log('🚀 ~ addDay', addDay)
            // if(addDay.length > 30){
            //     return this.$message.warning("日期范围不能超过一个月")
            // }
            this.dataListLoading = true;
            this.$http({
                url: this.$http.adornUrl(`/crm/pageCrmJxcSalesSum`),
                method: 'get',
                params: this.$http.adornParams({
                    begDate: this.beginDate,
                    endDate: this.endDate,
                    biz3: this.biz3
                }, false)
            }).then(({ data }) => {
                console.log('data:', data);
                this.totalAmount = data.obj.sumamt
            })
            this.$http({
                url: this.$http.adornUrl(`/crm/pageCrmJxcSalesdtl`),
                method: 'get',
                params: this.$http.adornParams({
                    current: page.currentPage,
                    size: page.pageSize,
                    begDate: this.beginDate,
                    endDate: this.endDate,
                    biz3: this.biz3
                }, false)
            }).then(({ data }) => {
                console.log('data:', data);
                this.tableData = data.obj.records
                this.page.total = data.obj.total
                this.dataListLoading = false
            })

        },
        oprClick() {
            this.$refs.departmentRef.init()
        },
        async handelImport() {
            const headerMap = {}
            this.tableColumn.forEach(element => {
                headerMap[element.label] = element.prop
            });
            const res = await excelToData(headerMap);
            const data = res.formatData;
            this.tableData.push(...data)

        },
        async handelSave() {
            console.log('this.tableData:', this.tableData);
            const addData = this.tableData.filter(i => !i.id);
            if (!addData.length) {
                this.$message({
                    message: '没有要保存的数据',
                    type: 'warning',
                    duration: 1500,
                })
                return
            }
            this.loading = true
            this.$http({
                url: this.$http.adornUrl(`/crm/addCrmJxcSalesdtl`),
                method: 'POST',
                data: this.$http.adornData(addData, false)
            }).then(({ data }) => {

                console.log('data:', data);
                this.getList(this.page)
                this.$message({
                    message: '操作成功',
                    type: 'success',
                    duration: 1500,
                    onClose: () => {
                        this.loading = false
                    }
                })
            }).finally(() => {
                // this.loading = false
            })

        },

    }
}
</script>

<style lang="scss" scoped>
.title {
    font-size: 20px;
    text-align: center;
    font-weight: bold;
}
</style>
